<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="new">
        <p>ni</p>
        <p class="name">wo</p>
        <p class="name">ta</p>
        <div id="haha">
            123
            <p ><i>真好</i></p>
            <a href="">545</a>
        </div>
    </div>
       <input value="123" >
   

    <script>
        // //整个root文档
        // console.log(document.documentElement);
        // console.log(document.head);
        // // 操作标题
        // document.title = 'ninhao'
        // console.log(document.title);
        // //修改body背景
        // document.body.bgColor = 'red'

        //通过ID找元素节点
        // var eleId = document.getElementById('new')
        // // id属性下的所有子元素
        // console.log(eleId.children)
        // //给索引为2的元素修改颜色
        // eleId.children[2].style.color = 'red'
        // //id 下所有字节
        // console.log(eleId.childNodes)

        //通过标签名找元素
    //     var ele = document.getElementsByTagName('div')
    //     console.log(ele[1])
    //   ele[1].innerText = '哇哈哈'
    //     ele[1].style.color ='red';

            //找指定节点下面的元素节点
        // var ele = document.getElementById('haha')
        // var ji =ele.getElementsByTagName('a')
        // console.log(ji)
        // ji[0].style.color ='purple'

        //通过类名
        // var eleId = document.getElementsByClassName('name')
        // console.log(eleId)
        // eleId[1].innerText ='天气好'


      //通过css选择器
    //     var cs = document.querySelector('#new p:first-child');
    //     console.log(cs)
    //     cs.style.fontSize ='40px'
    //     cs.style.color = 'red'
    //   console.log( cs.childNodes[0].nodeType) ;
    

        // 文本节点的内容
        // var ele = document.getElementById('new')
        // var nodes = ele.childNodes
        // nodes[1].textContent ='hhhhh'


        // 单行文本通过value来获取
        var ele = document.getElementsByTagName('input')
      ele[0].value ='456'
       var res = ele[0].value
    </script>
    



</body>
</html>